<div class="post-table-container" [@fadeIn]="'active'">
    <form class="form-vertical" role="form">
        <div class="row">
            <div class="col-md-12">
                <div class="input-group">
                    <input [(ngModel)]="searchStr" name="searchStr" class="form-control" type="text" placeholder="标题">
                    <span class="input-group-btn">
                        <button class="btn btn-secondary" type="button" (click)="searchRole()">
                            <i class="fa fa-search" aria-hidden="true"></i>
                        </button>
                    </span>
                </div>
            </div>
        </div>
    </form>
    <div class="row">
        <div class="col-md-12">
            <div class="post-item-container">
                <p-table [value]="postList" dataKey="id" editMode="row" [paginator]="true" [rows]="10" [pageLinks]="10"
                    [totalRecords]="totalRecords" [lazy]="true" (onLazyLoad)="pageChanged($event)"
                    styleClass="p-datatable-gridlines">
                    <ng-template pTemplate="header">
                        <tr>
                            <th>标题</th>
                            <th>作者</th>
                            <th>日期</th>
                            <th>操作</th>
                        </tr>
                    </ng-template>
                    <ng-template pTemplate="body" let-rowData let-editing="editing" let-ri="rowIndex">
                        <tr [pEditableRow]="rowData">
                            <td>
                                {{rowData.title}}
                            </td>
                            <td>
                                {{rowData.nickName}}
                            </td>
                            <td>
                                {{rowData.postTime}}
                            </td>
                            <td style="text-align:center">
                                <p-button icon="fa fa-pencil" styleClass="p-button-success"
                                    [style]="{ 'margin-right': '.5em' }" (click)="editPost(rowData, ri)"></p-button>
                                <p-button icon="fa fa-trash" styleClass="p-button-danger"
                                    (click)="delPost(rowData, ri)"></p-button>
                            </td>
                        </tr>
                    </ng-template>
                </p-table>
            </div>
        </div>
    </div>
</div>